﻿<!doctype html>
<html>
 <head>
     <meta charset="UTF-8">
     <meta name="Keywords" content="">
     <meta name="Description" content="">
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
     <link rel="stylesheet" type="text/css" href="lib/css/bootstrap.common.min.css" />
     <link rel="stylesheet" type="text/css" href="css/base.css" />
     <title></title>
 </head>
 <body>
     <div class="container">
         <header class="row header usrpage-header floating-top" id="header">
             <a class="pull-left header-btn" href="index.html"><span class="icon2 icon2-back"><span class="sr-only">返回</span></span></a>
             <h1>购物车</h1>
         </header>
         <!--如果空,cart-main加class：cart-empty-->
         <main class="row main cart-main">
             <header class="cart-head">
                 <!--向上滑动时悬浮在顶部-->
                 <button class="btn btn-default btn-sm pull-right">全选</button>
                 <button class="btn btn-default btn-sm pull-right">删除</button>
             </header>
             <ul class="cart-item-set">
                
                     <!--一个商品-->
                     <li class="cart-item">
                         <div class="cart-leftSide">
                             <div class="check-box checked" role="checkbox"><span class="icon2 icon2-hook"></span></div>
                         </div>
                         <article class="cart-item-article">
                             <header class="cart-item-title"><h4>原木质 创意台灯 床头灯卧室简约现代 可调光</h4></header>
                             <div class="cart-item-content">
                                 <div class="cart-goodsImg"><img src="images/example3.jpg" alt=""></div>
                                 <div class="cart-item-detail">
                                     <div class="cItem-info">
                                         颜色: <span id="">米色</span>
                                     </div>
                                     <div class="cItem-info">
                                         尺码: <span id="">XXXXL</span>
                                     </div>
                                     <div class="cItem-info">
                                         价格: <span id="" class="cItem-info-price">$999</span>
                                     </div>
                                     <div class="cItem-quantity">
                                         <div id="" class="cItem-quantity-btn"><span class="icon2 icon2-decrease"></span></div>
                                         <div id="" class="cItem-num">2</div>
                                         <div id="" class="cItem-quantity-btn"><span class="icon2 icon2-plus"></span></div>
                                     </div>
                                 </div>

                             </div>
                         </article>
                         <div class="cart-rightSide" role="button"><span class="icon2 icon2-forward2"></span></div>
                     </li>
                     <!--一个商品-->
                     <li class="cart-item">
                         <div class="cart-leftSide">
                             <div class="check-box" role="checkbox"><span class="icon2 icon2-hook"></span></div>
                         </div>
                         <article class="cart-item-article">
                             <header class="cart-item-title"><h4>原木质 创意台灯 床头灯卧室简约现代 可调光</h4></header>
                             <div class="cart-item-content">
                                 <div class="cart-goodsImg"><img src="images/example3.jpg" alt=""></div>
                                 <div class="cart-item-detail">
                                     <div class="cItem-info">
                                         颜色: <span id="">米色</span>
                                     </div>
                                     <div class="cItem-info">
                                         尺码: <span id="">XXXXL</span>
                                     </div>
                                     <div class="cItem-info">
                                         价格: <span id="" class="cItem-info-price">$999</span>
                                     </div>
                                     <div class="cItem-quantity">
                                         <div id="" class="cItem-quantity-btn"><span class="icon2 icon2-decrease"></span></div>
                                         <div id="" class="cItem-num">2</div>
                                         <div id="" class="cItem-quantity-btn"><span class="icon2 icon2-plus"></span></div>
                                     </div>
                                 </div>

                             </div>
                         </article>
                         <div class="cart-rightSide" role="button"><span class="icon2 icon2-forward2"></span></div>
                     </li>
                     <!--一个商品-->
                     <li class="cart-item">
                         <div class="cart-leftSide">
                             <div class="check-box checked" role="checkbox"><span class="icon2 icon2-hook"></span></div>
                         </div>
                         <article class="cart-item-article">
                             <header class="cart-item-title"><h4>原木质 创意台灯 床头灯卧室简约现代 可调光</h4></header>
                             <div class="cart-item-content">
                                 <div class="cart-goodsImg"><img src="images/example3.jpg" alt=""></div>
                                 <div class="cart-item-detail">
                                     <div class="cItem-info">
                                         颜色: <span id="Span1">米色</span>
                                     </div>
                                     <div class="cItem-info">
                                         尺码: <span id="Span2">XXXXL</span>
                                     </div>
                                     <div class="cItem-info">
                                         价格: <span id="Span3" class="cItem-info-price">$999</span>
                                     </div>
                                     <div class="cItem-quantity">
                                         <div id="Div1" class="cItem-quantity-btn"><span class="icon2 icon2-decrease"></span></div>
                                         <div id="Div2" class="cItem-num">2</div>
                                         <div id="Div3" class="cItem-quantity-btn"><span class="icon2 icon2-plus"></span></div>
                                     </div>
                                 </div>

                             </div>
                         </article>
                         <div class="cart-rightSide" role="button"><span class="icon2 icon2-forward2"></span></div>
                     </li>
                     <!--一个商品-->
                     <li class="cart-item">
                         <div class="cart-leftSide">
                             <div class="check-box checked" role="checkbox"><span class="icon2 icon2-hook"></span></div>
                         </div>
                         <article class="cart-item-article">
                             <header class="cart-item-title"><h4>原木质 创意台灯 床头灯卧室简约现代 可调光</h4></header>
                             <div class="cart-item-content">
                                 <div class="cart-goodsImg"><img src="images/example3.jpg" alt=""></div>
                                 <div class="cart-item-detail">
                                     <div class="cItem-info">
                                         颜色: <span id="Span4">米色</span>
                                     </div>
                                     <div class="cItem-info">
                                         尺码: <span id="Span5">XXXXL</span>
                                     </div>
                                     <div class="cItem-info">
                                         价格: <span id="Span6" class="cItem-info-price">$999</span>
                                     </div>
                                     <div class="cItem-quantity">
                                         <div id="Div4" class="cItem-quantity-btn"><span class="icon2 icon2-decrease"></span></div>
                                         <div id="Div5" class="cItem-num">2</div>
                                         <div id="Div6" class="cItem-quantity-btn"><span class="icon2 icon2-plus"></span></div>
                                     </div>
                                 </div>

                             </div>
                         </article>
                         <div class="cart-rightSide" role="button"><span class="icon2 icon2-forward2"></span></div>
                     </li>
                     <!--一个商品-->
                     <li class="cart-item">
                         <div class="cart-leftSide">
                             <div class="check-box checked" role="checkbox"><span class="icon2 icon2-hook"></span></div>
                         </div>
                         <article class="cart-item-article">
                             <header class="cart-item-title"><h4>原木质 创意台灯 床头灯卧室简约现代 可调光</h4></header>
                             <div class="cart-item-content">
                                 <div class="cart-goodsImg"><img src="images/example3.jpg" alt=""></div>
                                 <div class="cart-item-detail">
                                     <div class="cItem-info">
                                         颜色: <span id="Span7">米色</span>
                                     </div>
                                     <div class="cItem-info">
                                         尺码: <span id="Span8">XXXXL</span>
                                     </div>
                                     <div class="cItem-info">
                                         价格: <span id="Span9" class="cItem-info-price">$999</span>
                                     </div>
                                     <div class="cItem-quantity">
                                         <div id="Div7" class="cItem-quantity-btn"><span class="icon2 icon2-decrease"></span></div>
                                         <div id="Div8" class="cItem-num">2</div>
                                         <div id="Div9" class="cItem-quantity-btn"><span class="icon2 icon2-plus"></span></div>
                                     </div>
                                 </div>

                             </div>
                         </article>
                         <div class="cart-rightSide" role="button"><span class="icon2 icon2-forward2"></span></div>
                     </li>
                     <!--一个商品-->
                     <li class="cart-item">
                         <div class="cart-leftSide">
                             <div class="check-box checked" role="checkbox"><span class="icon2 icon2-hook"></span></div>
                         </div>
                         <article class="cart-item-article">
                             <header class="cart-item-title"><h4>原木质 创意台灯 床头灯卧室简约现代 可调光</h4></header>
                             <div class="cart-item-content">
                                 <div class="cart-goodsImg"><img src="images/example3.jpg" alt=""></div>
                                 <div class="cart-item-detail">
                                     <div class="cItem-info">
                                         颜色: <span id="Span10">米色</span>
                                     </div>
                                     <div class="cItem-info">
                                         尺码: <span id="Span11">XXXXL</span>
                                     </div>
                                     <div class="cItem-info">
                                         价格: <span id="Span12" class="cItem-info-price">$999</span>
                                     </div>
                                     <div class="cItem-quantity">
                                         <div id="Div10" class="cItem-quantity-btn"><span class="icon2 icon2-decrease"></span></div>
                                         <div id="Div11" class="cItem-num">2</div>
                                         <div id="Div12" class="cItem-quantity-btn"><span class="icon2 icon2-plus"></span></div>
                                     </div>
                                 </div>

                             </div>
                         </article>
                         <div class="cart-rightSide" role="button"><span class="icon2 icon2-forward2"></span></div>
                     </li>
                 
             </ul>
             <div class="cart-empty-hint">
                 <img src="images/cart/emptycart.png" alt="空空的"/>
                 <h5>您的购物车内还没有任何商品</h5>
                 <a href="index.html" class="btn btn-default btn-lg">去逛逛<span class="icon2 icon2-forward2-white"></span></a>
             </div>
         </main>
         
     </div>
     <footer class="cart-footer">
            <div class="col-xs-8">合计(不含运费):<span class="cart-totalPrice">$1234</span></div>
            <div class="col-xs-4"><a href="confirm.html">结算(<span>2</span>)</a></div> <!--cart-checkOut-->
     </footer>
     <script src="lib/js/zepto.min.js"></script>
     <script src="js/script2.js"></script>

</body>
</html>
